<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
	<title>Intranet UNAD</title>

	<link href="#{request.contextPath}/css/style.css" rel="stylesheet" type="text/css" />

</h:head>
<h:body>

	<h:form id="formLoggin">
	
	<h:outputLink id="loginLink" value="javascript:void(0)"
			onclick="PF('dlg').show()" title="login">
			<p:graphicImage value="/images/login.png" />
		</h:outputLink>

		<p:growl id="growl" showDetail="true" life="3000" />

		<p:dialog id="dialog" header="Login" widgetVar="dlg" resizable="false">

			<h:panelGrid columns="2" cellpadding="5">
				<h:outputLabel for="username" value="Username:" />
				<p:inputText value="#{loginBean.username}" id="username"
					required="true" label="username" />

				<h:outputLabel for="password" value="Password:" />
				<h:inputSecret value="#{loginBean.password}" id="password"
					required="true" label="password" />

				<f:facet name="footer">
					<p:commandButton id="loginButton" value="Login" update="growl"
						actionListener="#{loginBean.login}"
						oncomplete="handleLoginRequest(xhr, status, args)"/>
				</f:facet>
			</h:panelGrid>

		</p:dialog>
	
	</h:form>

	<h:form id="formLogo">

		<div>
			<p:separator />
			<p:graphicImage value="/images/logo.png" />
		</div>


	</h:form>

	<h:form id="formContent">

		<div>
			<ui:insert name="body">
				<!-- Composite content here -->
			</ui:insert>
		</div>

	</h:form>
	
	<h:form id="formLogoInferior">

			<p:separator />
			<p:separator />
		<div class="fondoNegro">
			
			<p:graphicImage value="/images/logoUNADgrisInferior.png" />
		</div>

	</h:form>

	<script type="text/javascript">
	function handleLoginRequest(xhr, status, args) {
        if(args.validationFailed || !args.loggedIn) {
            PF('dlg').jq.effect("shake", { times:5 }, 100);
        } 
        else {
            PF('dlg').hide();
            $('#loginLink').fadeOut();
        }
    }
</script>

</h:body>
</html>